var dateType = '1',  //日期类型
    dateStart = '', //开始日期
    dateEnd = '';   //结束日期
//用户选择
function selectSH(id) {
	var te = $("#SH").attr("btnType");
	if (te == "隐藏") {
		$("#SH").attr("btnType", "显示");
		$("#selectBox").fadeIn(600, function() {
			$("#selectBox").css("display", "block")
		})
	}
	if (te == "显示") {
		$("#SH").attr("btnType", "隐藏");
		$("#selectBox").fadeOut(600, function() {
			$("#selectBox").css("display", "none")
		})
	}
}
// 点击当日趋势/当月趋势/当年趋势开始
$(function() {
	test();
	
})
// 点击当日趋势/当月趋势/当年趋势开始

// 趋势分析 开始
function nenghaoZouShiFunc(data1, data2, data3, data4,XArr,title,lengedArr) {
	var myChart3 = echarts.init(document.getElementById('trendFenxi'));
	option3 = {
		title : {
			text : "单位("+title+")",
			x : "2%",
			y : "2%",
			textStyle : {
				color : "#fff",
			}
		},
		backgroundColor : "rgb(0,0,0,.2)",
		tooltip : {
			trigger : 'axis',
			axisPointer : {
				lineStyle : {
					color : '#57617B'
				}
			}
		},
		legend : {
			show : true,
			icon : 'rect',
			data:lengedArr,
			//data : [ '2018-12-17', '2018-12-18', '2018-12-19', '预测趋势' ],
			align : 'right',
			left : 'center',
			top : '0%',
			textStyle : {
				color : "#fff",
				fontSize : 20
			},
			itemWidth : 30,
			itemHeight : 20,
			itemGap : 15
		},
		grid : {
			left : '1%',
			right : '2%',
			top : '20%',
			bottom : '5%',
			containLabel : true
		},
		xAxis : [
				{
					type : 'category',
					boundaryGap : false,
					axisLine : {
						lineStyle : {
							color : '#fff'
						}
					},
					data:XArr,
					/*data : [ '13:00', '13:05', '13:10', '13:15', '13:20',
							'13:25', '13:30', '13:35', '13:40', '13:45',
							'13:50', '13:55' ]*/
				}, {
					axisLine : {
						show : false, // 上横轴
						lineStyle : {
							color : 'red',
						}
					},

				} ],
		yAxis : [ {
			axisLabel : {
				show : true,
				formatter : '{value}'
			},
			splitLine : {
				lineStyle : {
					color : 'rgba(255,255,255,.1)'
				}
			},
			axisLine : {
				lineStyle : {
					color : '#fff'
				}
			},
		} ],
		series : [ {
			//name : '2018-12-17',
			name:lengedArr[0],
			type : 'line',
			smooth : true,
			symbol : 'circle',
			symbolSize : 5,
			showSymbol : false,
			lineStyle : {
				normal : {
					width : 3
				}
			},
			/*areaStyle : {
				show:false,
				normal : {
					color : new echarts.graphic.LinearGradient(0, 0, 0, 1, [ {
						offset : 0.99,
						color : 'rgba(222,103,244, 0.2)'
					}, {
						offset : 0.9,
						color : 'rgba(222,103,244, 0.3)'
					}, {
						offset : 0.7,
						color : 'rgba(222,103,244, 0.5)'
					}, {
						offset : 0.5,
						color : 'rgba(222,103,244, 0.7)'
					}, {
						offset : 0.3,
						color : 'rgba(222,103,244, 0.8)'
					}, {
						offset : 0.1,
						color : 'rgba(222,103,244, 0.99)'
					} ], false),
					shadowColor : 'rgba(0, 0, 0, 0.9)',
					shadowBlur : 10
				}
			},*/
			itemStyle : {
				normal : {
					color : 'yellow',
					borderColor : 'yellow',
					borderWidth : 12
				}
			},
			// data: [, , , 34, 110, 220, 150, 75, 30, , , ]
			data : data1
		}, {
			//name : '2018-12-18',
			name:lengedArr[1],
			type : 'line',
			smooth : true,
			symbol : 'circle',
			symbolSize : 5,
			showSymbol : false,
			lineStyle : {
				normal : {
					width : 3
				}
			},
			/*areaStyle : {
				show:false,
				normal : {
					color : new echarts.graphic.LinearGradient(0, 0, 0, 1, [ {
						offset : 0.99,
						color : 'rgba(79,148,255, 0.2)'
					}, {
						offset : 0.9,
						color : 'rgba(79,148,255, 0.4)'
					}, {
						offset : 0.7,
						color : 'rgba(79,148,255, 0.5)'
					}, {
						offset : 0.5,
						color : 'rgba(79,148,255, 0.66)'
					}, {
						offset : 0.3,
						color : 'rgba(79,148,255, 0.86)'
					}, {
						offset : 0.1,
						color : 'rgba(79,148,255, 0.99)'
					} ], false),
					shadowColor : 'rgba(0, 0, 0, 0.9)',
					shadowBlur : 10
				}
			},*/
			itemStyle : {
				normal : {
					color : '#00ff00',
					borderColor : 'rgba(0,136,212,0.5)',
					borderWidth : 12
				}
			},
			// data: [10, 180, 75, 145, 222, 165, 132, 200, 182, 61, 164, 50]
			data : data2
		}, {
			//name : '2018-12-19',
			name:lengedArr[2],
			type : 'line',
			smooth : true,
			symbol : 'circle',
			symbolSize : 5,
			showSymbol : false,
			lineStyle : {
				normal : {
					width : 3
				}
			},
			/*areaStyle : {
				show:false,
				normal : {
					color : new echarts.graphic.LinearGradient(0, 0, 0, 1, [ {
						offset : 0.99,
						color : 'rgba(15,235,139, 0.2)'
					}, {
						offset : 0.9,
						color : 'rgba(15,235,139, 0.4)'
					}, {
						offset : 0.7,
						color : 'rgba(15,235,139, 0.5)'
					}, {
						offset : 0.5,
						color : 'rgba(15,235,139, 0.66)'
					}, {
						offset : 0.3,
						color : 'rgba(15,235,139, 0.86)'
					}, {
						offset : 0.1,
						color : 'rgba(15,235,139, 0.99)'
					} ], false),
					shadowColor : 'rgba(0, 0, 0, 0.9)',
					shadowBlur : 10
				}
			},*/
			itemStyle : {
				normal : {
					color : '#277ace',
					borderColor : 'rgba(0,136,212,0.5)',
					borderWidth : 12
				}
			},
			// data: [120, 110, 125, 145, 122, 165, 122, 220, 182, 191, 134,
			// 150]
			data : data3
		}, {
			//name : '预测趋势',
			name:lengedArr[3],
			type : 'line',
			smooth : true,
			symbol : 'circle',
			symbolSize : 5,
			showSymbol : false,
			lineStyle : {
				normal : {
					width : 4,
					borderColor : 'red',
					type : 'dotted' // 'dotted'虚线 'solid'实线
				}
			},
			/*areaStyle : {
				show:false,
				normal : {
					color : new echarts.graphic.LinearGradient(0, 0, 0, 1, [ {
						offset : 0.99,
						color : 'rgba(245,106,124, 0.2)'
					}, {
						offset : 0.9,
						color : 'rgba(245,106,124, 0.3)'
					}, {
						offset : 0.7,
						color : 'rgba(245,106,124, 0.5)'
					}, {
						offset : 0.5,
						color : 'rgba(245,106,124, 0.7)'
					}, {
						offset : 0.3,
						color : 'rgba(245,106,124, 0.8)'
					}, {
						offset : 0.1,
						color : 'rgba(245,106,124, 0.99)'
					} ], false),
					shadowColor : 'rgba(0, 0, 0, 0.9)',
					shadowBlur : 10
				}
			},*/
			itemStyle : {
				normal : {
					color : 'rgba(245,106,124)', // 预测走势
					borderColor : 'rgba(245,106,124)',
					borderWidth : 12
				}
			},
			// data: [12, 23, 32, 37, 110, 220, 150, 75, 30, 45, 342, 65]
			data : data4
		}, ]
	};
	setTimeout(function() {
		myChart3.setOption(option3);
	}, 500);
}
// 趋势分析 结束

// =========================
//设置session参数
function setSessionfunc(typeid,zid){
	//设置当前用户的session值
    //typeid 系统分类id (比如对应前端八大类), zid 当前用户的站点id
	var url="/bigscrenn/setUserSession?typeid="+typeid+"&zid="+zid;
    $.ajax({
	     cache: true,
	     type: "POST",
	     url:url,
	     data:"",
	     async: false,				   
	     success: function(data){
              console.log(data,'参数');         
	     }
    		
    });	
};
// 得到指定站点趋势分析选择列表
function test() {
	new Vue({
		el : "#app",
		data : {
			userid : "",   //用户id
			unitID : "",   //单位id
			userType : "", //用户类型
			kehu : [],     //左边列表
			zhandian : [], //站点数组
			zid : "",      //站点
			zName:'',       //站点名称
		    danweiID:'',    //单位id
		    danweiName:'',   //单位名称
		},
		mounted : function() {
			this.getSession();
		},
		methods : {
			//session
			getSession:function(){
				var vs = this;
				var userid,unitID,userType;
				var url="/bigscrenn/getUserSession";
			     $.ajax({
				     cache: true,
				     type: "POST",
				     url:url,
				     data:"",
				     async: false,				   
				     success: function(data){
				    	 console.log("session数据：",data);
				    	 //js解析json串
			     	     var obj = JSON.parse(data);
			             if (obj.session.length>0){
			                   /*alert(obj.session[0].UserID);//用户id
			                   alert(obj.session[0].Name);//用户名称
			                   alert(obj.session[0].UnitID);//用户单位id
			                   alert(obj.session[0].UserAuthority);//用户权限 2 所有单位 3 本单位
			                   alert(obj.session[0].typeid);//系统分类id (比如对应前端八大类)
			                   alert(obj.session[0].zid);//当前用户的站点id*/			            	   
			            	   vs.userid = obj.session[0].UserID;
			 	  			   vs.unitID = obj.session[0].UnitID;
			 	  			   vs.userType = obj.session[0].UserAuthority;
			 	  			   vs.zid = obj.session[0].zid;
			 	  			   
			 	  			   vs.danweiID = (obj.session[0].cid1).split(",")[0];  //单位id方法
			 	  			   vs.danweiName = (obj.session[0].cid1).split(",")[1];//上页选中来的单位名称
			 	  			   
			 	  			   //vs.zid = obj.session[0].zid;
			 	  			   vs.zid = (obj.session[0].zid).split(",")[0];  //站点id
			 	  			   vs.zName = (obj.session[0].zid).split(",")[1];//上页选中来的站点名称
			 	  			   //alert("趋势分析 vs.danweiID="+vs.danweiID + " vs.danweiName= "+vs.danweiName +"vs.zid = "+vs.zid +"vs.zName = "+vs.zName);
			 	  			   $('#topTitle').text(vs.zName);
			 	  			   
			 	  			   zhandianid = vs.zid;
			 	  			   onlineFunc();
			 	  			   
			 	  			   console.log("站点id="+vs.zid);
			 	  			   //setSessionfunc('',vs.zid+','+vs.zName,'',(vs.danweiID+','+vs.danweiName));     // session存站点（第二个参）
			            	 }
			                 //alert("vs.zid = "+vs.zid+"userid="+vs.userid+"and unitID="+vs.unitID+"and userType="+vs.userType) ;
			                 
				             if(vs.danweiID==undefined||vs.danweiID==''){
			                	 vs.danweiID=vs.unitID;
			                 }
			                if(vs.zid && vs.zid != '' && vs.zid != null && vs.zid!= undefined){
			                	vs.getUnitIData(vs.userid,vs.danweiID);  //括号里是用户id，单位id
			                	vs.getData(vs.userid,vs.zid);          //括号里是用户id ,站点id
			                }
			                //具体用户进来的操作
			                if(vs.userType==3){
			                	console.log("我的身份是具体用户");
			                	$(".backHome-box >a").css("display","none");// “返回首页”隐藏
			                }
				     }
			     });
			},
			//站点列表
			getUnitIData:function(sy_userid,sy_uniId){
				var unitData = this;
				// userid用户id,unitid单位id,unitid为空时表示调用多个单位的站点信息
			    var url="/bigscrenn/getSiteList?userid="+sy_userid+"&unitid="+sy_uniId;
			    console.log("进来的趋势分析地址="+url);
			     $.ajax({
				     cache: true,
				     type: "POST",
				     url:url,
				     data:"",
				     async: false,				   
				     success: function(data){
                       // alert("站点列表="+data);
                       // js解析json串
                       var obj = JSON.parse(data);
                        //alert("记录数="+obj.total);//记录数
                       unitData.zhandian = obj.rows;// 分类后的站点（用户）
                       // unitData.getPicData(obj.rows[0].CID);//电气图ID（进入页面时默认第一个站点的电气图）
                       // alert("========="+obj.rows[0].CID);
                       unitData.$nextTick(function() {
                    	   var arrr = $(".zhanDian");
                    	   // alert("arrr=="+arrr.length);
                    	   var firstACID = $(".zhanDian:first()").attr("cid");
                    	   localStorage.setItem("energyCID", firstACID);// 没有点击存储本页第一个的站点CID覆盖homecid
                    	   var thisCid="";
                    	   for (var n=0;n<arrr.length;n++){
                    		   arrr[n].index = n;
                    		   arrr[n].onclick = function(){
                    			   // alert($(this).text());
                    			   thisCid = $(this).attr("cid");
                    			   setSessionfunc('',thisCid+','+$(this).text(),'',(unitData.danweiID+','+unitData.danweiName));     // session存站点（第二个参）                      //session存参
	                        	   window.location.href = "./specificUser.html";// 返回具体页面
                    		   }
                    		   
                    	   }
                       });
				     }
			     });
			},
			getData : function(userid,zid) {
				var vm = this;
				// 参数userid用户id,unitid站点id
				var url = "/bigscrenn/getTrendList?userid="+userid+"&unitid="+zid;
				console.log("趋势分析选择列表地址 = "+url);
				$.ajax({
					cache : true,
					type : "POST",
					url : url,
					data : "",
					async : false,
					success : function(data) {
						console.log("趋势分析选择列表=:" + data);
						// js解析json串
						var obj = JSON.parse(data);
						// 选择列表数据
						for (var i = 0; i < obj.rows.length; i++) {
							// alert(obj.rows[i].ID);// 选择项id值
							// alert(obj.rows[i].NAME);// 选择项名称
							vm.kehu.push({
								"name" : obj.rows[i].NAME,
								"id" : obj.rows[i].ID,
								"danWei":obj.rows[i].CONVERSION
							});

						}
						// alert((vm.kehu).length);
						vm.$nextTick(function() {
							
							// 打开页面默认数据开始
							$("#thisTitle").text($("#dl>dd:first() a").text());//默认选中第一对应标题
							var firstID = $("#dl>dd:first() a").attr("id");    //获取左边选项第一个id
							var danwei = $("#dl>dd:first() a").attr("danwei"); //获取左边选项第一个单位
							
							localStorage.setItem("danwei",danwei);             //存储左边选项第一个单位
							$("#dl>dd:first() a").addClass("sideActive");
							//alert("firstID="+firstID);
							
							console.log("默认第一个==："+"/bigscrenn/getTrendStatistics?userid=0100000000000004&unitid=000000000001&itemid="+firstID+"&type=1");
							//参数userid用户id,unitid站点id,itemid统计项id,type统计类型 1当天趋势2当月趋势3当年趋势
							var defaultURL = "/bigscrenn/getTrendStatistics?userid="+vm.userid+"&unitid="+vm.zid+"&itemid="+firstID+"&type=1";
							console.log("打开页面默认趋势地址="+defaultURL);
							test1(defaultURL);
							// 打开页面默认数据结束
							
							layui.use('element', function() {
								var element = layui.element; // 导航的hover效果、二级菜单等功能，需要依赖element模块

								// 监听导航点击
								element.on('nav(demo)', function(elem) {
									// console.log(elem)
									// alert(elem.text());
									$("#thisTitle").text(elem.text());             //选中选项对应标题
									var currentID = $(this).attr("id");            //获取左边当前选中的选项id
									var current_danwei = $(this).attr("danwei");   //获取左边当前选中的选项单位
									
									localStorage.setItem("danwei",current_danwei); //存储当前单位
									
									$("#dl>dd a").removeClass("sideActive");
									$(this).addClass("sideActive");
									
									//选择左边选项后 将当前选中的选项id绑定到地址上，并调用test1()方法
									dateType = $(".xz").find('input').attr("dateType");//获取当前日|月|年
									//alert("type = "+type);
									if(dateType==null){dateType=1}
									 //参数userid用户id,unitid站点id,itemid统计项id,type统计类型 1当天趋势2当月趋势3当年趋势
									//var url="/bigscrenn/getTrendStatistics?userid=0100000000000004&unitid=000000000001&itemid=A00000000001&type=1";
									var tapafterURL = "/bigscrenn/getTrendStatistics?userid="+vm.userid+"&unitid="+vm.zid+"&itemid="+currentID+"&type="+dateType;
									console.log("点击左边选项后的趋势地址="+tapafterURL);
									test1(tapafterURL);
									
								});
							});
							//点击当前日、月、年趋势操作
							$(".am-radio-inline").removeClass('xz');
							$(".am-radio-inline").eq(0).addClass('xz');
							secondLiTab = $(".am-radio-inline");
							secondLiTab.click(function() {
								var index = secondLiTab.index(this);
								$(".am-radio-inline").removeClass('xz');
								$(".am-radio-inline").eq(index).addClass('xz');
								
								var riqiType = "",leftListID="";
							    leftListID = $(".sideActive").attr('id');   //获取当前左边选中的ID
								dateType = $(this).find('input').attr("dateType");   //获取当前日|月|年
								//alert("leftListID = "+leftListID+" dateType = "+dateType);
								
								var rpURL = "/bigscrenn/getTrendStatistics?userid="+vm.userid+"&unitid="+vm.zid+"&itemid="+leftListID+"&type="+dateType;
								//alert("此时当年的地址==："+rpURL);
								test1(rpURL);
							})
						})
					}
				});

			}

		},
	});
}
// ==========
// 得到指定站点趋势分析选择列表
//test1();
function test1(url) {
	//alert("进来的url=="+url);
	var lengedArr = [];
	var nameArr1 = [],nameArr2 = [],nameArr3 = [],nameArr4 = [];
	var valueArr1 = [],valueArr2 = [],valueArr3 = [],valueArr4 = [];
	// 参数userid用户id,unitid站点id,itemid统计项id,type统计类型 1当天趋势2当月趋势3当年趋势
	//var url = "/bigscrenn/getTrendStatistics?userid=0100000000000004&unitid=000000000001&itemid=A00000000001&type=1";
	$.ajax({
		cache : true,
		type : "POST",
		url : url,
		data : "",
		async : false,
		success : function(data) {
			console.log("趋势分析==:" + data);
			// js解析json串
			var obj = JSON.parse(data);

			// 前一个周期的统计数据
			//alert(obj.datea);// 统计日期
			lengedArr.push(obj.datea,obj.dateb,obj.datec,obj.dated);
			console.log("lengedArr = "+JSON.stringify(lengedArr));
			for (var i = 0; i < obj.rowsa.length; i++) {
				// alert(obj.rowsa[i].NAME);//名称
				// alert(obj.rowsa[i].VALUE);//值
				nameArr1.push(obj.rowsa[i].NAME);
				valueArr1.push(obj.rowsa[i].VALUE);
			}
			// 上一个周期的统计数据
			//alert(obj.dateb);// 统计日期
			for (var i = 0; i < obj.rowsb.length; i++) {
				// alert(obj.rowsb[i].NAME);//名称
				// alert(obj.rowsb[i].VALUE);//值
				nameArr2.push(obj.rowsb[i].NAME);
				valueArr2.push(obj.rowsb[i].VALUE);
			}
			// 本周期的统计数据
			//alert(obj.datec);// 统计日期
			for (var i = 0; i < obj.rowsc.length; i++) {
				// alert(obj.rowsc[i].NAME);//名称
				// alert(obj.rowsc[i].VALUE);//值
				nameArr3.push(obj.rowsc[i].NAME);
				valueArr3.push(obj.rowsc[i].VALUE);
			}
			// 趋势分析统计数据
			//alert("obj.dated:"+obj.dated);// 统计日期
			for (var i = 0; i < obj.rowsd.length; i++) {
				 //alert(obj.rowsd[i].NAME);//名称
				 //alert(obj.rowsd[i].VALUE);//值
				nameArr4.push(obj.rowsd[i].NAME);
				valueArr4.push(obj.rowsd[i].VALUE);
			}
			console.log("valueArr1="+JSON.stringify(valueArr1)+"valueArr2="+JSON.stringify(valueArr3)+"valueArr3="+JSON.stringify(valueArr3)+"valueArr4="+JSON.stringify(valueArr4));
			var danwei = localStorage.getItem("danwei");     //获取本地存储的单位(用于图表title)
			//alert("danwei==="+danwei);
			if(danwei=="undefined"){
				danwei = ''
			}
			nenghaoZouShiFunc(valueArr1,valueArr2,valueArr3,valueArr4,nameArr4,danwei,lengedArr);
		}
	});

}

//值班人员
//onlineFunc();
function onlineFunc(){
	//alert("online zhandianid = "+zhandianid);
	// unitid 是站点ID
	// var url="/bigtongji/getRotaList?unitid=000000000001";
	var url="/bigtongji/getRotaList?unitid="+zhandianid;
	 $.ajax({
	     cache: true,
	     type: "POST",
	     url:url,
	     data:"",
	     async: false,				   
	     success: function(data){
        // alert(data);
        console.log(data);
        var dataObj=eval("("+data+")");// 转换为json对象
        // alert(dataObj);
        // alert(dataObj);
        if(dataObj.rows.length>0){
    		 $("#onlineNotice").html('');
    		 for (var i = 0; i < dataObj.rows.length; i++) {
         		var cid= dataObj.rows[i].cid;
         		var name= dataObj.rows[i].rname;
         		var phone= dataObj.rows[i].phoneCode;
         		//alert(cid);
         		//alert("cid="+cid+"name="+name+"phone="+phone);
        		 $("#onlineNotice").append('<li><span>👨‍⚖️&nbsp;&nbsp;<span id="onlineName1">'+name+'</span>&nbsp;电话：</span><span>'+phone+'</span></li>');
         	  }
    	  }
    	 if(dataObj.rows.length==0){
    		$("#onlineNotice").html(''); 
    	 }
	     }
	 });

}
//值班人员结束

//返回上一级跳转逻辑处理
function bachFunc(){
	var urlsStr = localStorage.getItem("urls");
	var ss = JSON.parse(urlsStr);
	if(ss.sanji != undefined &&  ss.sanji !=''){
    	//alert(ss.sanji);
	    location.href = './specificHome.html';
    	return;
    }
    if(ss.erji != undefined && ss.erji !=''){
    	//alert(ss.erji);
	    location.href = './intlgMonitor.html';
	    return;
    }if(ss.yiji != undefined &&  ss.yiji !=''){
    	//alert(ss.yiji);
	    window.location.href = './pro_Home.html';
	    return;
    }else{
	   //alert(222)
    }
}